<template>
  <de-container class="pa-5">
    <avue-crud
      ref="crud"
      v-model="form"
      :page.sync="page"
      :data="tableData"
      :table-loading="tableLoading"
      :option="tableOption"
      :search.sync="searchForm"
      @on-load="loadListData"
      @search-change="onSearchChange"
      @keyup.enter="onSearchChange"
      @search-reset="onSearchReset"
      @row-save="onRowSave"
      @row-update="onRowUpdate"
      @row-del="onRowDelete"
      @refresh-change="onRefresh"
      @selection-change="onSelectionChange"
      @filter-change="onFilterChange"
      @sort-change="onSortChange"
    >
      <template slot="menuLeft" slot-scope="{ size }">
        <el-button icon="el-icon-plus" :size="size" type="primary" @click="onClickAdd"> 新增 </el-button>
        <el-button icon="el-icon-edit" :size="size" :disabled="selection.length <= 0" @click="issueBatch">
          下发
        </el-button>
        <el-button icon="el-icon-delete" :size="size" :disabled="selection.length <= 0" @click="deleteBatch">
          批量删除
        </el-button>
      </template>
      <template slot="menu" slot-scope="{ size, row }">
        <el-button type="text" :size="size" @click="onClickView(row)"> 任务详情 </el-button>
        <el-button v-if="row.status == 0" type="text" :size="size" @click="onClickEdit(row)"> 编辑 </el-button>
        <el-button v-if="row.status == 1" type="text" :size="size" @click="report(row)"> 进度上报 </el-button>
        <el-button v-if="row.status == 1" type="text" :size="size" @click="updateStatus(row, 0)"> 撤回 </el-button>
        <el-button v-if="row.status == 2" type="text" :size="size" @click="updateStatus(row, 3)"> 关闭 </el-button>

        <el-button v-if="row.status !== 1 && row.status !== 0" type="text" :size="size" @click="reportView(row)">
          进度详情
        </el-button>
        <el-button v-if="row.status !== 1" type="text" :size="size" @click="onClicDelete(row)"> 删除 </el-button>
      </template>
      <template slot="status" slot-scope="{ row }">
        <span v-if="row.status >= 4"> <span class="status-dot warning"></span>{{ row.$status }} </span>
        <span v-else-if="row.status >= 3"> <span class="status-dot danger"></span>{{ row.$status }} </span>
        <span v-else-if="row.status >= 2"> <span class="status-dot success"></span>{{ row.$status }} </span>
        <span v-else-if="row.status >= 1"> <span class="status-dot primary"></span>{{ row.$status }} </span>
        <span v-else> <span class="status-dot info"></span>{{ row.$status }} </span>
      </template>
    </avue-crud>
    <addDialog
      v-if="addDialogVisable"
      :task-data="taskData"
      :title="title"
      :dialog-visible="addDialogVisable"
      @closeDialog="closeDialog"
    ></addDialog>
  </de-container>
</template>

<script>
import moment from 'moment'
import addDialog from './dialog/addDialog.vue'
import {
  requestUserCreate,
  requestUserUpdate,
  requestUserDelete,
  requestUserPasswordReset,
  requestUserStatusUpdate,
} from '@/api/system/user'
import DeContainer from '@/components/dataease/DeContainer.vue'
import ListMixin from '@/utils/mixins/list-mixin'
import {
  requestTaskDelete,
  requestTaskPage,
  requestTaskDistribute,
  requestTaskUpdateStatus,
  requestTaskDeleteBatch,
} from '@/api/warning-task/task'

const DEFAULT_LIST_MAP_FUNC = (item) => {
  const ret = item
  if (item.createTime) {
    ret.createAt = moment(item.createTime).format('YYYY-MM-DD HH:mm:ss')
  }
  return ret
}
const DEFAULT_EDIT_MAP_FUNC = (item) => {
  const ret = item
  item.switching = false

  return ret
}

export default {
  name: 'UserList',
  components: { DeContainer, addDialog },
  mixins: [ListMixin],
  props: {
    isHome: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      title: '',
      addDialogVisable: false,
      listApi: requestTaskPage,
      createApi: requestUserCreate,
      updateApi: requestUserUpdate,
      deleteApi: requestTaskDelete,
      listMapFunc: DEFAULT_LIST_MAP_FUNC,
      editMapFunc: DEFAULT_EDIT_MAP_FUNC,
      tableOption: {
        menuWidth: 320,
        addBtn: false,
        editBtn: false,
        viewBtn: false,
        delBtn: false,
        searchMenuPosition: 'left',
        menuFixed: 'right',
        delBtnIcon: '-',
        column: [
          {
            label: '任务名称',
            prop: 'taskName',
            maxlength: 24,
            showWordLimit: true,
            span: 12,
            align: 'left',
            search: true,
            editDisabled: true,
            overHidden: true,
          },
          {
            label: '状态',
            prop: 'status',
            type: 'select',
            search: true,
            value: 0,
            dicData: [
              {
                label: '待下发',
                value: 0,
              },
              {
                label: '进行中',
                value: 1,
              },
              {
                label: '已完成',
                value: 2,
              },
              {
                label: '已关闭',
                value: 3,
              },
              {
                label: '已撤回',
                value: 4,
              },
            ],
            span: 12,
            align: 'center',
            overHidden: true,
          },
          {
            label: '任务描述',
            prop: 'description',
            span: 24,
            type: 'date',
            overHidden: true,
            searchSpan: 8,
            overHidden: true,
          },
          {
            label: '任务开始时间',
            prop: 'startTime',
            span: 24,
            type: 'date',
            width: 150,
            searchSpan: 8,
            overHidden: true,
          },
          {
            label: '任务结束时间',
            prop: 'endTime',
            span: 24,
            width: 150,
            type: 'date',
            searchSpan: 8,
            overHidden: true,
          },
          {
            label: '责任部门',
            prop: 'deptId',
            search: true,
            span: 24,
            type: 'tree',
            cascader: ['directorId'],
            dicUrl: '/api/dept/tree',
            dicMethod: 'post',
            props: {
              label: 'name',
              value: 'id',
            },
            searchSpan: 8,
            overHidden: true,
          },
          {
            label: '责任人',
            prop: 'directorName',
            span: 24,
            search: true,
            searchSpan: 8,
            overHidden: true,
          },
          {
            label: '创建方式',
            prop: 'createMethod',
            span: 24,
            dicData: [
              {
                label: '手动创建',
                value: 1,
              },
              {
                label: '自动创建',
                value: 2,
              },
            ],
            hide: true,
            searchSpan: 8,
          },
          {
            label: '创建人',
            prop: 'createBy',
            span: 24,
            type: 'date',
            searchSpan: 8,
          },
          {
            label: '创建时间',
            prop: 'createAt',
            span: 24,
            type: 'date',
            searchSpan: 8,
            overHidden: true,
          },
          {
            label: '修改人',
            prop: 'updateBy',
            span: 24,
            hide: true,
            searchSpan: 8,
          },
          {
            label: '更新时间',
            prop: 'updateAt',
            span: 24,
            hide: true,
            searchSpan: 8,
          },
        ],
      },
      taskData: {},
    }
  },
  created() {},
  methods: {
    onClickAdd() {
      this.addDialogVisable = true
      this.title = '新增任务'
      this.taskData = {}
    },
    onClickEdit(row) {
      this.taskData = row
      this.title = '编辑任务'
      this.addDialogVisable = true
    },
    onClicDelete(row) {
      this.onRowDelete(row)
    },
    onClickView(row) {
      this.taskData = row
      this.title = '任务详情'
      this.addDialogVisable = true
    },
    closeDialog() {
      this.addDialogVisable = false
      this.onRefresh()
    },
    deleteBatch() {
      const index = this.selection.findIndex((item) => {
        return item.status == 1
      })
      if (index >= 0) {
        this.$message.error('进行中的数据不可以删除')
        return
      }
      const ids = this.selection.map((item) => {
        return item.id
      })
      requestTaskDeleteBatch(ids).then((res) => {
        if (res.success) {
          this.$message({
            type: 'success',
            message: '操作成功',
          })
          this.onRefresh()
        } else {
          this.$message({
            type: 'error',
            message: res.message,
          })
        }
      })
    },
    report(data) {
      this.$router.push({
        path: this.isHome ? '/home/target-task/task-schedule' : '/redirect/task-schedule',
        query: { id: data.id, isHome: this.isHome },
      })
    },
    reportView(data) {
      this.$router.push({
        path: this.isHome ? '/home/target-task/task-schedule' : '/redirect/task-schedule',
        query: { id: data.id, type: 'view', isHome: this.isHome },
      })
    },
    issueBatch() {
      const index = this.selection.findIndex((item) => {
        return item.status !== 0
      })
      if (index >= 0) {
        this.$message.error('只能下发待下发数据')
        return
      }
      const ids = this.selection.map((item) => {
        return item.id
      })
      requestTaskDistribute(ids).then((res) => {
        if (res.success) {
          this.$message({
            type: 'success',
            message: '操作成功',
          })
          this.onRefresh()
        } else {
          this.$message({
            type: 'error',
            message: res.message,
          })
        }
      })
    },
    updateStatus(data, status) {
      const param = {
        id: data.id,
        status: status,
      }
      requestTaskUpdateStatus(param).then((res) => {
        if (res.success) {
          this.$message({
            type: 'success',
            message: '操作成功',
          })
          this.onRefresh()
        } else {
          this.$message({
            type: 'error',
            message: res.message,
          })
        }
      })
    },
    withdraw() {},
  },
}
</script>

<style lang="scss"></style>
